<!DOCTYPE html>
<html xmlns:th="www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="description" content="大学生就业实训,品质就业,职业规划,IT行业人才基地"/>
    <title>蜗牛书城(woniuxy.com)-正品低价、品质保障、配送及时、轻松购物！</title>

    <!-- 引入Bootstrap核心样式文件 -->
    <link href="bootstrap-3.4.1/css/bootstrap.min.css" rel="stylesheet">
    <!-- 引入jQuery核心js文件 -->
    <script src="javascript/jQuery-1.12.4.js"></script>
    <!-- 引入BootStrap核心js文件 -->
    <script src="bootstrap-3.4.1/js/bootstrap.min.js"></script>


    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>

    <link href="css/common.css" rel="stylesheet"/>
    <link href="css/top.css" rel="stylesheet"/>
    <link href="css/foot.css" rel="stylesheet"/>

    <link href="css/index.css" rel="stylesheet"/>

</head>
<body>
<div th:fragment="header">
    <!--  最顶部的导航栏 -->
    <div class="top-nav">
        <div class="container">
            <div>
                <span class="location-top fl iconfont mr5">&#xe60b;</span>
                <span class="fl mr420">上海</span>
            </div>
            <ul>
                <li><a href="#">我的购物车</a></li>
                <li class="spacer">|</li>
                <li><a href="#">我的订单</a></li>
                <li class="spacer">|</li>
                <li>
                    <a href="/toLogin" th:if="${session.loginName==null}">你好,请登录</a>

                    <a href="/account/toCenter" th:if="${session.loginName!=null}">你好, [[${session.loginName}]]</a>
                    &nbsp;&nbsp;
                    <a class="free-login">免费注册</a>
                </li>
                <li>
                    <a href="/newIndex" th:if="${session.loginName!=null}">退出[[${session.loginName}]] &nbsp&nbsp</a>
                </li>
            </ul>
        </div>
    </div>

    <!--  =================== head =============================== -->
    <div class="head">
        <div class="container">
            <!-- ============= logo ============= -->
            <div class="logo fl">
                <h1>
                    <a class="hot-word">蜗牛学苑</a>
                </h1>
            </div>
            <!-- ============= 搜索框部份 ============= -->
            <div class="search fl ml100">
                <div class="up">
                    <div class="search-box fl mr18">
                        <input class="fl" type="text" value="请输入搜索关键字"/>
                        <span class="photo">&#xe663;</span>
                        <span class="search-icon fl">&#xe660;</span>
                    </div>

                    <div class="cart fl">
                        <span class="iconfont">&#xe622;</span>
                        <a href="#">我的购物车</a>
                        <i class="num">0</i>
                    </div>
                </div>

                <div class="navitems">
                    <ol>
                        <li><a class="red-and-weight" href="#">秒杀</a></li>
                        <li><a class="red-and-weight" href="#">优惠券</a></li>
                        <li><a href="#">程序设计</a></li>
                        <li><a href="#">数据库</a></li>
                        <li><a href="#">网络与数据通信</a></li>
                        <li><a href="#">科普读物</a></li>
                        <li><a href="#">建筑学</a></li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

</div>


<!-- =============== 最后的网站底部 =============== -->
<div class="container-fluid" id="footer" th:fragment="footer">
    <div class="container">
        <div class="row">
            <div class="col-md-2">
                <dl>
                    <dt><b>热线电话</b></dt>
                    <dd id="tel"><i>020-000000</i></dd>
                    <dd class="openDate">周一至周五9:00-21:00</dd>
                    <dd class="openDate">周六至周日9:00-17:30</dd>
                    <dd><a href="#">在线客服</a></dd>
                </dl>
            </div>
            <div class="col-md-2">
                <dl>
                    <dt><b>服务保障</b></dt>
                    <dd><a href="#">正品保证</a></dd>
                    <dd><a href="#">7天无理由退换</a></dd>
                    <dd><a href="#">退货返运费</a></dd>
                    <dd><a href="#">7X15小时客户服务</a></dd>
                </dl>
            </div>
            <div class="col-md-2">
                <dl>
                    <dt><b>支付方式</b></dt>
                    <dd><a href="#">公司转账</a></dd>
                    <dd><a href="#">货到付款</a></dd>
                    <dd><a href="#">在线支付</a></dd>
                    <dd><a href="#">分期付款</a></dd>
                </dl>
            </div>
            <div class="col-md-2">
                <dl>
                    <dt><b>商家服务</b></dt>
                    <dd><a href="#">商家信息</a></dd>
                    <dd><a href="#">培训中心</a></dd>
                    <dd><a href="#">广告服务</a></dd>
                    <dd><a href="#">服务市场</a></dd>
                </dl>
            </div>
            <div class="col-md-2">
                <dl>
                    <dt><b>物流配送</b></dt>
                    <dd><a href="#">免运费</a></dd>
                    <dd><a href="#">海外配送</a></dd>
                    <dd><a href="#">EMS</a></dd>
                    <dd><a href="#">211限时达</a></dd>
                </dl>
            </div>
            <div class="col-md-2">
                <dl>
                    <dt><b>关注我们</b></dt>
                    <img src="img/code.png">
                </dl>
            </div>
        </div>

    </div>
</div>


</body>
</html>
